import { useTranslete } from "providers/hooks/useTranslete";

import { Menu } from "shared/ui/menu";

import { ContentPageWrapperProps } from "./index.types";

import * as Styled from "./index.styled";

export const ContentPageWrapper = (props: ContentPageWrapperProps) => {
	const { title, leftIcon, content, actions } = props;

	const { t } = useTranslete();

	return (
		<Styled.ContentPageWrapper>
			<Styled.ContentPageHeader>
				<Styled.ContentPageHeaderTitleBlock>
					{leftIcon}
					<span>{t(title)}</span>
				</Styled.ContentPageHeaderTitleBlock>
				{actions && <Menu items={actions} />}
			</Styled.ContentPageHeader>
			{content}
		</Styled.ContentPageWrapper>
	);
};
